<template>
  <div class="account-box">
    <div class="item-title-account">
      <span class="title-icon"></span>
      {{acountTitle}}
    </div>
    <div
      class="item-account-box"
      v-if="Item==='1'"
    >
      <div class="search-nav-box1">
        <div class="item-search">
          <span>交易时间</span>
          <el-date-picker
            v-model="company.startdate"
            type="date"
            placeholder="请选择"
            value-format="yyyy-MM-dd"
            style="width:140px"
          ></el-date-picker>
          <span class="separator">~</span>
          <el-date-picker
            v-model="company.enddate"
            type="date"
            placeholder="请选择"
            value-format="yyyy-MM-dd"
            style="width:140px"
          ></el-date-picker>
        </div>
        <div class="item-search">
          <span>银行账户</span>
          <el-input
            v-model="company.oppaccountname"
            placeholder="请输入账户名称"
            clearable
            style="width:190px"
          ></el-input>
        </div>
        <div class="item-search">
          <span>银行账号</span>
          <el-input
            v-model="company.oppaccountno"
            placeholder="请输入银行账号"
            clearable
            style="width:190px"
          ></el-input>
        </div>
        <div
          class="item-botton"
          @click="SearchBtn()"
        >查询</div>
      </div>
      <div class="table-list-box">
        <el-table
          :data="AccountPlayCash"
          stripe
          border
          style="width:100%"
          class="AccountPlayCash-table"
          v-loading="loading"
        >
          <!-- <el-table-column
            label="企业名称"
            align="center"
          >
            <template slot-scope="scope">
              <span
                class="item-list"
                @click="OnlineCompay(scope.row)"
              >{{scope.row.companyname}}</span>
            </template>
          </el-table-column>
          <el-table-column
            prop="city"
            label="城市"
            align="center"
          ></el-table-column> -->
          <!-- <el-table-column prop="paymentname" label="银行账户" align="center"></el-table-column> -->
          <el-table-column
            label="银行账户"
            align="center"
          >
            <template slot-scope="scope">
              <span>{{scope.row.oppaccountname}}</span>
            </template>
          </el-table-column>
          <el-table-column
            label="银行账号"
            align="center"
          >
            <template slot-scope="scope">
              <span>{{scope.row.oppaccountno}}</span>
            </template>
          </el-table-column>
          <el-table-column
            label="交易时间"
            align="center"
          >
            <template slot-scope="scope">
              <span>{{scope.row.rechargdate}}</span>
            </template>
          </el-table-column>
          <el-table-column
            label="交易金额"
            align="center"
          >
            <template slot-scope="scope">
              <span>{{scope.row.totalfee}}</span>
            </template>
          </el-table-column>
          <el-table-column
            label="备注"
            align="center"
          >
            <template slot-scope="scope">
              <span>{{scope.row.abstracts}}</span>
            </template>
          </el-table-column>
          <el-table-column
            label="操作"
            align="center"
            v-if="global.powerAllBtn.cwgl.dgczsbBtn && optShowOne"
          >
            <template slot-scope="scope">
              <span
                class="item-control"
                @click="OnlinePlay(scope.row)"
              >充值上报</span>
            </template>
          </el-table-column>
        </el-table>
        <!-- <el-pagination @current-change="AccountCurrentChange" :total="pagination.total" :current-page="pagination.pageNum" :page-size="pagination.pageSize" layout="total, prev, pager, next, jumper" background>
        </el-pagination>-->
        <el-pagination
          @size-change="handleSizeChange"
          @current-change="AccountCurrentChange"
          :current-page="pagination.pageNum"
          :page-sizes="[10,20, 30, 50,100]"
          :page-size="pagination.pageSize"
          layout="total, sizes, prev, pager, next, jumper"
          :total="pagination.total"
          background
        ></el-pagination>
      </div>
    </div>
    <!-- 新增充值 -->
    <div
      class="item-account-box"
      v-if="Item==='2'"
    >
      <div class="onplaycash-box">
        <div class="item-name">
          <span class="item-title">银行账户</span>
          <!-- <el-select
            v-model="onplaycash.accountname"
            placeholder="请选择银行账户"
            :disabled="onplaycash.companyid?false:true"
          >
            <el-option
              v-for="item in accountName"
              :key="item"
              :label="item"
              :value="item"
            >
            </el-option>
          </el-select> -->
          <input
            v-model="onplaycash.oppaccountname"
            class="item-inpute"
            placeholder="请输入银行账户"
            :disabled="onplaycash.oppaccountname?true:false"
          >
        </div>
        <div class="item-name">
          <span class="item-title">银行账号</span>
          <input
            v-model="onplaycash.oppaccountno"
            class="item-inpute"
            placeholder="请输入银行账户"
            :disabled="onplaycash.oppaccountno?true:false"
          >
        </div>
        <div class="item-name">
          <span class="item-title">公司名称</span>
          <el-select
            filterable
            clearable
            :filter-method="handleCompanynameFilter"
            v-model="onplaycash.companyid"
            placeholder="请选择公司名称"
            @change="changeCompanyname"
          >
            <el-option
              v-for="item in allCompanyname"
              :key="item.companyid"
              :label="item.companyname"
              :value="item.companyid"
            >
            </el-option>
          </el-select>
        </div>
        <div class="item-name">
          <span class="item-title">充值金额</span>
          <input
            type="number"
            v-model="onplaycash.totalfee"
            class="item-inpute"
            placeholder="请输入充值金额"
            :disabled="onplaycash.totalfee?true:false"
          >
        </div>
        <div class="opload-item">
          <span class="opload-title">上传凭证</span>
          <span class="add-infornation">
            <label
              for="file_ipt"
              class="add-title-list"
            >
              <i
                class="el-icon-plus"
                v-show="isShow"
              ></i>
            </label>
            <img
              :src="imageUrl"
              alt
              class="add-img"
            >
            <input
              ref="file_ipt"
              id="file_ipt"
              type="file"
              style="display:none"
              @change="AddImgInfo()"
            >
          </span>
        </div>
        <div class="submit-buttom">
          <span @click="goBack()">返回</span>
          <span @click="SubmitCash()">上报</span>
        </div>
      </div>
      <!-- <div
        class="tip-box"
        v-if="cash===true"
      >
        <div
          class="item-tip-box"
          v-if="success===false"
        >
          <div class="tip-title">上报提示</div>
          <div class="tip-centext">
            <p>是否确定为"{{onplaycash.companyname}}"</p>
            <p>
              充值
              <span class="setColor">{{onplaycash.totalfee}}</span>元？
            </p>
          </div>
          <div class="tip-button">
            <div
              class="item-button1"
              @click="cancle()"
            >取消</div>
            <div
              class="item-button2"
              @click="submit()"
            >确定</div>
          </div>
        </div>
        <div
          class="item-tip-box"
          v-if="success===true"
        >
          <div class="tip-title">提示</div>
          <div class="tip-centext-success">
            <i class="el-icon-check"></i>
            <div class="success">充值成功</div>
          </div>
        </div>
      </div> -->
    </div>
    <el-dialog
      :visible.sync="checkFlag"
      width="1040px"
      class="jhdialog"
    >
      <check
        v-show="checkFlag"
        :companyName="companyname"
        :companyId="companyid"
        :type="'0'"
        :tabNum="'4'"
      ></check>
    </el-dialog>

    <el-dialog
      :visible.sync="warnDialogVisible"
      width="500px"
      @close="closeWarnDialog"
    >
      <div class="warn-dialog-header">
        <span>上报原因</span>
      </div>
      <div class="warn-dialog-body">
        <div class="warn-dialog-body-title">发送内容</div>
        <el-input
          type="textarea"
          :rows="6"
          v-model.trim="reportContent"
        ></el-input>
        <div class="warn-dialog-btn">
          <el-button
            style="margin-right: 30px;"
            @click="warnDialogVisible = false"
          >取消</el-button>
          <el-button
            type="primary"
            @click="confirmReport"
          >确定</el-button>
        </div>
      </div>
    </el-dialog>
  </div>
</template>
<style scoped src='./account.css'>
</style>
<script src='./account.js'>
</script>